<template>
  <div>
    <div>
      <table class="table table-warning table-sm table-hover table-responsive">
        <caption>啊啊啊啊</caption>
        <thead class="thead-dark">
        <tr>
          <th scope="col">序号</th>
          <th scope="col">姓名</th>
          <th scope="col">年龄</th>
          <th scope="col">职业</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <th scope="row">1</th>
          <td scope="col">张三</td>
          <td scope="col">22</td>
          <td scope="col">工程师</td>
        </tr>
        <tr>
          <th scope="row">1</th>
          <td scope="col">张三</td>
          <td scope="col">22</td>
          <td scope="col">工程师</td>
        </tr>
        <tr>
          <th scope="row">2</th>
          <td scope="col">张三</td>
          <td scope="col">22</td>
          <td scope="col">工程师</td>
        </tr>
        <tr>
          <th scope="row">3</th>
          <td scope="col">张三</td>
          <td colspan="2">22</td>
        </tr>
        </tbody>
      </table>
    </div>
    <div>
      <form>
        <div class="form-group">
          <label for="formP01">
            地址
          </label>
          <input type="text" style="width: 300px" class="form-control" id="formP01" placeholder="输入地址">
        </div>
      </form>
    </div>
  </div>
</template>

<script>
export default {
  name: 'TablePractice'
}
</script>

<style scoped>

</style>
